<template>
  <div class="home">
    <dl v-for="(v,i) in list " :key="i">
      <dt @click="toDetail(v)">
        <img :src="v.img" alt />
      </dt>
      <dd>
        <h3>{{v.title}}</h3>
      </dd>
    </dl>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { getList } from "@/api/index";
import "./index.css";

@Component({
  methods: {
    toDetail(id) {
      this.$router.push({
        name: "detail",query:id
      });
    }
  }
})
export default class Index extends Vue {
  private list: any[] = [];

  created() {
    getList().then(res => {
      this.list = res.data;
    });
  }
}
</script>

<style>
</style>